<%@page import="java.util.List"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>农汇购-订单列表</title>
<link href="${pageContext.request.contextPath }/css/bootstrap.min.css" rel="stylesheet">
<link href="${pageContext.request.contextPath }/layui/css/layui.css" rel="stylesheet">
<script src="${pageContext.request.contextPath }/js/jquery.min.js"></script>
<script src="${pageContext.request.contextPath }/js/bootstrap.min.js"></script>
<script src="${pageContext.request.contextPath }/layui/layui.js"></script>
<!--<script type="text/html" id="barEdit">
    <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
    <a class="layui-btn layui-btn-xs" lay-event="delt">删除</a>
</script>-->
</head>
<body>
	<blockquote class="layui-elem-quote news_search">
	    <form class="layui-form">
	        <div>
	            <div class="layui-inline">
	                <input type="text" id="username" value="" placeholder="请输入商品名称"
	                       class="layui-input search_input">
	            </div>
	            
	            <a class="layui-btn search_btn" lay-submit="" data-type="search"
	               lay-filter="search">查询</a>
	        </div>
	
	    </form>
	</blockquote>
	<div class="layui-form">
	    <table class="layui-table" id="userList" lay-filter="userList"></table>
	    <fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;">
		</fieldset>
	</div>
</body>
<!-- disabled="{{ d.zhekou <= 1 ? false : true }}" -->
<script type="text/html" id="flagT">
  <input type="checkbox" id="flag_{{d.id}}" name="flag_{{d.id}}" value="{{d.zhekou}}"  lay-filter="flagD" lay-skin="switch" lay-text="已发货|待发货" {{ d.zhekou <= 1 ? '' : 'checked' }} />
</script>
<script type="text/javascript">
function parseD(d){
	date = new Date(d); 
	var d = date.getDate()< 10 ? "0" + date.getDate() : date.getDate();
	return date.getFullYear()+"-"+(date.getMonth() + 1)+"-"+ d;
}
layui.config({
    base: "js/"
}).use(
    ['form', 'layer', 'jquery', 'table', 'laydate','upload'],
    function () {
        var form = layui.form, table = layui.table, layer = parent.layer === undefined ? layui.layer
            : parent.layer,laypage = layui.laypage
            $ = layui.jquery,
            active = {
                search: function () {
                    var username = $('#username');
                    //执行重载
                    table.reload('userList', {
                        page: {
                            curr: 1
                        },
                        where: {
                        	//account代表的不再是账号而是商品名
                        	account: username.val()
                        }
                    });
                }
            };

        //加载页面数据
        table.render({
            id: 'userList',
            elem: '#userList',
            url: "/rj2002/sale/getOrdersList",
            limit: 5,
            limits: [5, 10],
            editTrigger: 'dblclick',
            cols: [[ //表头
            	{
                    field: 'btn',
                    width: 50,
                    align: 'center',
                    templet: function (d) {
                        return '<div style="width: 100%; height: 100%;cursor: pointer;font-size=33px;" lay-event="addRowTable">+</div>'
                    }
                },
                {
                    field: 'id',
                    title: 'ID',
                    sort: true
                },
                {
                    field: 'account',
                    title: '账号信息',
                },
                {
                    field: 'money',
                    title: '总价',
                },
                {
                    field: 'detail',
                    title: '收货地址',
                },
                {
                    field: 'createtime',
                    title: '时间',
                    templet:function(d){return parseD(d.createtime)}
                },
                {
                    field: 'flag',
                    title: '去发货',
                    width:110,
                    templet: '#flagT', 
                    unresize: true
                }
            ]],
            page: {
            	first: '首页'
                ,last: '尾页'
                ,prev: '<em>←</em>'
                ,next: '<em>→</em>'
				,theme: '#1E9FFF'
            },
            parseData: function(res){ //将原始数据解析成 table 组件所规定的数据
             return {
                 "code": res.code, //解析接口状态
                 "msg": res.msg, //解析提示文本
                 "count": res.count, //解析数据长度
                 "data": res.data //解析数据列表
               };
             }
            //, where: {}
            //开启分页
        });
       
        //监听工具条
        table.on('tool(userList)', function (obj) {
            var data = obj.data;
            console.log(data);
            var layEvent = obj.event; 
            var $this = $(this);
            var tr = $this.parents('tr');
            var trIndex = tr.data('index');
            
            
            if (layEvent === 'addRowTable') {
                // 外围的table的id + tableIn_ + 当前的tr的data-index
                $(this).attr('lay-event', 'fold').html('-');
                var tableId = 'tableOut_tableIn_' + trIndex;
                var _html = [
                    '<tr class="table-item">',
                    '<td colspan="' + tr.find('td').length + '" style="padding: 6px 12px;">',
                    '<table id="' + tableId + '"></table>',
                    '</td>',
                    '</tr>'
                ];
                tr.after(_html.join('\n'));
                // 渲染table
                table.render({
                    elem: '#' +tableId,
                    data: data.orderdetails||[],
                    cols: [[
                        {field:'goodsname', title: '商品名称'},
                        {field:'goodsnum', title: '商品数量'},
                        {field:'price', title: '单价'}
                    ]],

                });
                // $(window).resize();
            }else if (layEvent === 'fold') {
                $(this).attr('lay-event', 'addRowTable').html('+');
                tr.next().remove();
            }
        });
        table.on('sort(userList)', function (obj) { //注：tool是工具条事件名，test是table原始容器的属性 lay-filter="对应的值"
            table.reload('userList', {
                initSort: obj //记录初始排序，如果不设的话，将无法标记表头的排序状态。 layui 2.1.1 新增参数
                , where: { //请求参数（注意：这里面的参数可任意定义，并非下面固定的格式）
                    field: obj.field //排序字段
                    , order: obj.type //排序方式
                }
            });
        });
        
        form.on('switch(flagD)', function(obj){
            console.log(this.name+"---------"+this.value+"---"+obj.elem.checked)
            $.ajax({
				url:"/rj2002/sale/updateGoodsFlag",
				type:"post",
				dataType:"json",
				data:{
					'id':this.name.substring(5,this.name.length),
					'zhekou':obj.elem.checked?1.1:0.0
				},
				success:function(data){ 
					layer.alert(data.data,{icon: 1},function(index){ window.location.reload(); });
				},
				error:function(data){ 
					layer.alert(data.data,{icon: 3},function(index){ window.location.reload(); });
				}
			});              
        });
        
        layer.config({
        	offset: ['100px', '50px']
       	});
        //查询
        $(".search_btn").click(function () {
            var type = $(this).data('type');
            active[type] ? active[type].call(this) : '';
        })

    })

</script>



</html>